import React from 'react';
import './goods-list.less'

interface Props {
   goodsList: GoodsItem[]
}
interface GoodsItem {
    goodsImage: string;
    goodsTitle: string;
    goodsDesc: string;
}

const GoodsList: React.FC<Props> = ({ goodsList }) => {
    const goodsItem = goodsList.map((item: GoodsItem) =>
        <div className="col-lg-4 col-md-6 col-sm-12">
            <div className="card">
                <div className="card-body">
                    <img src={item.goodsImage} alt="商品图"/>
                    <h5>{item.goodsTitle}</h5>
                    <p>{item.goodsDesc}</p>
                </div>
            </div>
        </div>
    )
    return (
        <div className="goods-list row">
            {goodsItem}
        </div>
    );
};

export default GoodsList;
